{% extends "base.html" %}

{% block title %}Top Rudenesses{% endblock %}
{% block content %}

<div id="create-todo">
<form action="/create" method="POST">
    <p>
    <input type="text" id="new-todo" name="body" 
        placeholder="Create new rudeness"/>
    </p>
    <input type="submit" />
</form>
</div>

<div id="rudenesses">
    <ul id="todo-list">
        {% for rudeness in rudenesses %}
        <li>
            <div class="rudeness-info">
                {{ rudeness.body }}
                <div class="uses">
                Uses: {{ rudeness.use_count }}
                </div>
            </div>

            <form action="/use" method="POST">
                <input type="hidden" name="key" value="{{ rudeness.key }}" />
                <input class="use-button" type="submit" value="use" />
            </form>

        </li>
        {% endfor %}
    </ul>
</div>
{% endblock %}
